<!--计量单位选择框-->
<template>
  <div>
    <BasicModal v-bind="$attrs" @register="register" :title="modalTitle" width="800px"
      @ok="handleOk" destroyOnClose @visible-change="visibleChange">
      <BasicTable :columns="columns" v-bind="config" :useSearchForm="true" :formConfig="formConfig"
        :rowSelection="rowSelection" :api="getArrangementPlanList" :searchInfo="searchInfo"
        :indexColumnProps="indexColumnProps"></BasicTable>
    </BasicModal>
  </div>
</template>
<script lang="ts">
  import {
    defineComponent,
    ref,
    unref
  } from 'vue';
  import {
    BasicModal,
    useModalInner
  } from '/@/components/Modal';
  import {
    getArrangementPlanList
  } from './base.api';
  import {
    createAsyncComponent
  } from '/@/utils/factory/createAsyncComponent';
  import {
    useSelectBiz
  } from '/@/components/Form/src/jeecg/hooks/useSelectBiz';
  import {
    selectProps
  } from '/@/components/Form/src/jeecg/props/props';
  import {
    useAttrs
  } from '/@/hooks/core/useAttrs';
  import {
    render
  } from '/@/utils/common/renderUtils';

  export default defineComponent({
    name: 'CalculateSelectModal',
    components: {
      //此处需要异步加载BasicTable
      BasicModal,
      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), {
        loading: true,
      }),
    },
    props: {
      ...selectProps,
      //选择框标题
      modalTitle: {
        type: String,
        default: '排产列表选择',
      },
      multiple: {
        type: Boolean,
        default: false
      }
    },

    emits: ['register', 'getSelectResult'],
    setup(props, { emit }) {
      let tableName: string = ''; //实体表名
      //注册弹框
      const [register, {
        closeModal
      }] = useModalInner(async (data) => {
        tableName = data.tableName;
      });
      const attrs = useAttrs();
      //表格配置
      const config = {
        canResize: false,
        bordered: true,
        size: 'small',
        rowKey: unref(props).rowKey,
        labelKey: 'documentTypeName',
        isRadioSelection: !(props.multiple == true) ?? true,
        // 请求之前对参数做处理
        beforeFetch(params) {
          params.tableName = tableName;
        },
      };
      const getBindValue = Object.assign({}, unref(props), unref(attrs), config);
      const [{
        rowSelection,
        indexColumnProps,
        visibleChange,
        getSelectResult,
        reset
      }] = useSelectBiz(getArrangementPlanList, getBindValue);
      rowSelection.columnWidth = 50;
      indexColumnProps.width = 50;
      const searchInfo = ref(props.params);
      //查询form
      const formConfig = {
        labelWidth: 120,
        baseColProps: {
          xs: 8,
          sm: 8,
          md: 8,
          lg: 8,
          xl: 8,
          xxl: 8,
        },
        schemas: [{
            label: "排产日期",
            field: "operateTime",
            component: 'DatePicker',
            componentProps: {
              showTime: true,
              valueFormat: 'YYYY-MM-DD HH:mm:ss'
            },
            colProps: {
              span: 6
            },
          },
          {
            label: "上线时间",
            field: "lineDate",
            component: 'DatePicker',
            componentProps: {
              showTime: true,
              valueFormat: 'YYYY-MM-DD HH:mm:ss'
            },
            colProps: {
              span: 6
            },
          },
          {
            label: "订单编号",
            field: "orderNumber",
            component: 'Input',
            colProps: {
              span: 6
            },
          },
        ],
      };
      //定义表格列
      const columns = [{
          title: '排产日期',
          align: "center",
          sorter: true,
          width: 120,
          type: 'date',
          dataIndex: 'createTime',
          customRender: ({
            text
          }) => {
            return !text ? "" : (text.length > 10 ? text.substr(0, 10) : text)
          },
        },
        {
          title: '订单编号',
          align: "center",
          width: 150,
          dataIndex: 'orderNumber',
        },
        {
          title: '行号',
          align: "center",
          width: 100,
          dataIndex: 'rowNum',
        },
        {
          title: '工作中心',
          align: "center",
          width: 100,
          dataIndex: 'workCenter'
        },
        {
          title: '资源名称',
          align: "center",
          width: 120,
          dataIndex: 'resourceName'
        },
        {
          title: '产品编码',
          align: "center",
          width: 150,
          dataIndex: 'materialCode',
        },
        {
          title: '产品名称',
          align: "center",
          width: 150,
          dataIndex: 'materialName',
        },
        {
          title: '图号',
          align: "center",
          width: 100,
          dataIndex: 'drawingNo',
        },
        {
          title: '订单数量',
          align: "center",
          width: 100,
          dataIndex: 'quantity',
        },
        {
          title: '订单交期',
          align: "center",
          width: 120,
          dataIndex: 'deliveryDate',
          customRender: ({
            text
          }) => {
            return !text ? "" : (text.length > 10 ? text.substr(0, 10) : text)
          },
        },
        {
          title: '生产单号',
          align: "center",
          width: 150,
          dataIndex: 'productOrderCode',
        },
        {
          title: '上线日期',
          align: "center",
          width: 120,
          dataIndex: 'lineDate',
          customRender: ({
            text
          }) => {
            return !text ? "" : (text.length > 10 ? text.substr(0, 10) : text)
          },
        },
        {
          title: '是否关闭',
          align: "center",
          width: 120,
          dataIndex: 'isCompleted',
          customRender: ({
            text
          }) => text == 0 ? "否" : text == 1 ? '是' : ''
        },
        {
          title: '工艺',
          align: "center",
          width: 100,
          dataIndex: 'process',
        },
        {
          title: '上期未排量',
          align: "center",
          width: 120,
          dataIndex: 'previousUnscheduled',
        },
        {
          title: '库存',
          align: "center",
          width: 100,
          dataIndex: 'inventory',
        },
        {
          title: '需排产数',
          align: "center",
          width: 100,
          dataIndex: 'requiredProduction',
        },
        {
          title: '是否下发',
          align: "center",
          width: 100,
          sorter: true,
          type: 'list',
          dataIndex: 'whetherIssue',
          enum: [{
              value: 1,
              title: '是'
            },
            {
              value: 0,
              title: '否'
            },
          ],

          customRender: ({
            text
          }) => text == 0 ? "否" : text == 1 ? '是' : ''
        },
        {
          title: '是否释放',
          align: "center",
          width: 100,
          sorter: true,
          type: 'list',
          dataIndex: 'isReleased',
          enum: [{
              value: 1,
              title: '是'
            },
            {
              value: 0,
              title: '否'
            },
          ],
          customRender: ({
            text
          }) => text == 0 ? "否" : text == 1 ? '是' : ''
        },
      ];

      /**
       * 确定选择
       */
      function handleOk() {
        getSelectResult((options, values) => {
          //回传选项和已选择的值
          emit('getSelectResult', options, values);
          //关闭弹窗
          closeModal();
          // 清空选择器的选择
          reset();
        });
      }

      return {
        config,
        handleOk,
        searchInfo,
        register,
        indexColumnProps,
        visibleChange,
        getArrangementPlanList,
        formConfig,
        getBindValue,
        columns,
        rowSelection,
      };
    },
  });

</script>
